<template>
	<el-card shadow="hover">
		<template v-slot:header>
			领导行程
			<div style="float: right;display: inline-flex">
				<sc-icon style="cursor: pointer;width: 18px; margin-right: 10px;" @click="reLoadLeadActivity" title="刷新"><el-icon-refresh-right/></sc-icon>
				<sc-icon style="cursor: pointer;width: 18px;" @click="getMoreLeadActivity" title="全部"><el-icon-more-filled/></sc-icon>
			</div>
		</template>
		<div style="height: 210px;text-align: center;">
			<el-table :data="activityList" style="width: 100%" :show-header="false" @row-click="showActivityDetails" class="customer-table">
				<el-table-column prop="title" width="120">
					<template #default="scope">
						<div style="position: relative;height: 23px">
							<el-avatar :src="scope.row.avatar" size="small"></el-avatar>
							<span style="position: absolute;margin-left: 10px">{{scope.row.leaderUserName}}</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="title" :show-overflow-tooltip="true">
					<template #default="scope">
						【{{scope.row.ledActTypeName}}】 {{scope.row.title}}
					</template>
				</el-table-column>
				<el-table-column prop="beginTime" width="150" align="center"></el-table-column>
				<el-table-column prop="endTime" width="150" align="right"></el-table-column>
			</el-table>
		</div>
	</el-card>
	<lead-act-details v-if="dialog.save" ref="leaActDialog" @closed="dialog.save=false"></lead-act-details>
</template>

<script>
import leadActDetails from "@/views/info/leaderactivity/leadActDetails";
export default {
	name: 'Leader Activity For Desk',
	components: {
		leadActDetails,
	},
	data() {
		return {
			dialog: {
				save: false
			},
			activityList:[],
			timer:null
		}
	},
	created() {
		clearInterval(this.timer)
		this.timer = null
	},
	beforeUnmount() {
		clearInterval(this.timer);
		this.timer = null
	},
	mounted() {
		this.getLeadActivityListForDesk();
		this.setTimer();
	},
	methods: {
		reLoadLeadActivity(){
			this.getLeadActivityListForDesk();
		},
		getMoreLeadActivity(){
			this.$nextTick(() => {
				this.$router.replace({
					path: '/info/leaderactivity/query',
				})
			})
		},
		async getLeadActivityListForDesk(){
			var res = await this.$API.info.leadActivity.getLeadActivityListForDesk.get();
			if (res.code == 200) {
				this.activityList = res.data
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		},
		showActivityDetails(row, event, column) {
			this.dialog.save = true
			this.$nextTick(() => {
				this.$refs.leaActDialog.open().setData(row)
			})
		},
		setTimer() {
			if(this.timer == null) {
				this.timer = setInterval( () => {
					this.getLeadActivityListForDesk();
				}, this.$TOOL.data.get("MSG_TIME"))
			}
		}
	}
}
</script>
